﻿@using System.Data
@{
    ViewBag.Title = "Window";
    Layout = "~/Areas/Admin/Views/Shared/AdminLayout.cshtml";
    DataTable sortTable = ViewData["sort"] as DataTable;
    DataTable attTable = ViewData["att"] as DataTable;
}
<script src="/Scripts/jquery-1.8.2.min.js"></script>
<script src="/Scripts/kindeditor/kindeditor-all-min.js"></script>
<link href="/Scripts/kindeditor/themes/default/default.css" rel="stylesheet" />
<link rel="stylesheet" href="/Scripts/kindeditor/plugins/code/prettify.css" />
<script charset="utf-8" src="/Scripts/kindeditor/lang/zh-CN.js"></script>
<script charset="utf-8" src="/Scripts/kindeditor/plugins/code/prettify.js"></script>
<script src="~/Scripts/kindeditor/plugins/insertfile/insertfile.js"></script>
<script src="/Scripts/ajaxfileupload.js"></script>
<style type="text/css">
  
     .atcsort{width: 130px;height: 30px;display: block;float: left;margin-left: 10px; font-size: 12px;line-height: 30px; text-align: center; border: 1px #666666 solid;color: black; cursor: pointer;}
    .atcsort1{width: 70px;height: 30px; font-size: 12px;line-height: 30px; text-align: center;background-color: #666666;color: black;}
    .imgs{width: 100px;height: 100px;float: left;font-size:12px;margin-left: 10px;line-height: 20px;border:1px #cccccc solid;overflow: hidden;}
    .imgs img{width: 100px; height: 70px;}
    .tp_s{float: left;width: 50px;margin-left: 20px;}
    .sp_att{width: 600px;height: 30px;}
    .sp_att input{width: 100px;height: 20px;}
    #att {
        width: 98%;
        margin: 0px auto;
        color: #333333;
        text-align: center;
        border-collapse: collapse;
        margin-top: 20px;
    }
     
    #att td,th {
        border: 1px solid #00A5A5;
        height: 30px;
    }
    .aeidt{width: 50px;height: 20px;overflow: hidden;}
    .adel{width: 50px;height: 20px;overflow: hidden;}
    .sctp{width: 70px;height: 30px;color: #fff;background: #666;font-size: 12px;text-align: center;line-height: 30px;display: block;}
</style>
<input name="nimg" id="nimg" type="hidden" value="" />
<input name="tdes" id="tdes" type="hidden" value="" />
<input name="newscontent" id="newscontent" type="hidden" />
<input name="sort" id="sort" type="hidden" value="0" />
<div style="width:100%;height:500px; overflow:scroll; border:1px solid;">

    <table style="margin-left: 10px; font-size: 12px;">
        <tr>
            <td><label>商品名称</label></td>
            <td><input type="text" id="name" style="width: 300px;" /></td>
        </tr>
        <tr>
            <td><label>商品价格</label></td>
            <td><input type="text" id="price" style="width: 100px;" /></td>
        </tr>
        <tr>
            <td><label>折扣价格</label></td>
            <td><input type="text" id="dprice" style="width: 100px;" value="0" /></td>
        </tr>
        <tr>
            <td><label>商品数量</label></td>
            <td><input type="text" id="count" style="width: 80px;" /></td>
        </tr>
      
        <tr>
            <td><label>销量基数</label></td>
            <td><input type="text" id="paycount" style="width: 80px;" /></td>
        </tr>
        <tr>
            <td><label>运费</label></td>
            <td><input type="text" id="freight" style="width: 80px;" /></td>
        </tr>
        <tr>
            <td><label>商品分类</label></td>
            <td id="sort">
                @{
                    foreach (DataRow row in sortTable.Rows)
                    {
                        <a class="atcsort" cid="0" sortid="@row["Id"]">@row["Name"]</a>
                    }
                }
            </td>
        </tr>
        <tr>
            <td><label>是否显示</label></td>
            <td><input type="checkbox" id="isshow" checked="checked" style="height: 20px; width:20px;" /></td>
        </tr>
        <tr>
            <td><label>是否下架</label></td>
            <td><input type="checkbox" id="isxj" style="height: 20px; width:20px;" /></td>
        </tr>
        <tr>
            <td><label>热销商品</label></td>
            <td><input type="checkbox" id="rx_good" style="height: 20px; width:20px;" /></td>
        </tr>
        <tr>
            <td colspan="2">
                <p style="color: red;">图片尺寸：（800px X 800px）或 （600px X 600px）</p>
            </td>
        </tr>
        <tr>
            <td>
                <a class="sctp" onclick="checkfile()">上传图片</a>
              
                <input id="fileToUpload" style="display: none; cursor: pointer;" type="file" onchange="upload()" name="upfile">
            </td>
            <td id="imglist">
                <div class="imgs">
                    <img src="#" />
                    <div>
                        <label style="float: left;" onclick="del(1)">删除</label>
                        <input type="text" class="tp_s" value="1" />
                    </div>
                </div>
                <div class="imgs">
                    <img src="#" />
                    <div>
                        <label style="float: left;" onclick="del(2)">删除</label>
                        <input type="text" class="tp_s" value="2" />
                    </div>
                </div>
                <div class="imgs">
                    <img src="#" />
                    <div>
                        <label style="float: left;" onclick="del(3)">删除</label>
                        <input type="text" class="tp_s" value="3" />
                    </div>
                </div>
                <div class="imgs">
                    <img src="#" />
                    <div>
                        <label style="float: left;" onclick="del(4)">删除</label>
                        <input type="text" class="tp_s" value="4" />
                    </div>
                </div>
                <div class="imgs">
                    <img src="#" />
                    <div>
                        <label style="float: left;" onclick="del(5)">删除</label>
                        <input type="text" class="tp_s" value="5" />
                    </div>
                </div>
            </td>
        </tr>
        <tr>
            <td colspan="2"></td>
        </tr>
        <tr style="display: none;">
            <td><label>商品属性</label></td>
            <td>
                <div class="sp_att">
                    <input type="hidden" id="attid" value="0" />
                    <label>参数名称</label><input type="text" id="csname" />
                    <label>参数值</label><input type="text" id="csval" />
                    <label>价格</label><input type="text" id="csprice" />
                    <button style="width: 70px;height: 30px;" id="saveatt">保存</button>
                </div>
                <table id="att">
                    <tr>
                        <th width="100">参数名称</th>
                        <th width="100">参数值</th>
                        <th width="100">价格</th>
                        <th width="100">操作</th>
                    </tr>
                    @{
                        var i = 0;
                        var str = "";
                        foreach (DataRow row in attTable.Rows)
                        {
                            Random rad = new Random();
                            str += "<tr id='id_" + i + "'><td>" + row["Name"] + "</td><td>" + row["Value"] + "</td><td>" + row["Price"] + "</td><td><input type=\"hidden\" value='" + row["Id"] + "' /><button class=\"aeidt\" onclick='aeidt(\"id_" + i + "\")'>修改</button>&nbsp;&nbsp;<button class=\"adel\" onclick='adel('id_" + i + "')'>删除</button></td></tr>";
                            i++;
                        }
                        @Html.Raw(str)
                    }
                </table>
            </td>
        </tr>
       
     
        <tr>
            <td colspan="2">
                <p style="color: red;"><br /><br />商品描述图片宽度统一大小，宽度要么全是600px，要么全是800px</p>
            </td>
        </tr>
        <tr>
            <td colspan="2"><label>商品描述</label></td>
        </tr>
        <tr>
            <td colspan="2">
                <textarea id="content1" style="width:800px;height:400px;visibility:hidden;"></textarea>
            </td>
        </tr>

        <tr>
            <td colspan="2"></td>
        </tr>
    </table>
    <div style="width: 1000px; height: 40px; margin-top: 50px;">
        <div class="botton" style="margin-left: 340px;" onclick="edit()">保存</div>
        <div class="botton" style="margin-left: 50px;" onclick="history.go(-1)">取消</div>
    </div>
    <div style="width: 1000px; height: 40px; margin-top: 200px; "></div>
</div>
    <script>

        var id = "@ViewData["id"]";
        var editor;
        KindEditor.ready(function (K) {
            editor = K.create('#content1', {
                cssPath: '/Scripts/kindeditor/plugins/code/prettify.css',
                uploadJson: '/Scripts/kindeditor/aspnet/upload_json.ashx',
                fileManagerJson: '/Scripts/kindeditor/aspnet/file_manager_json.ashx',
                allowFileManager: true,
                afterCreate: function () {
                    var self = this;
                    K.ctrl(document, 13, function () {
                        self.sync();
                        K('form[name=example]')[0].submit();
                    });
                    K.ctrl(self.edit.doc, 13, function () {
                        self.sync();
                        K('form[name=example]')[0].submit();
                    });
                }
            });
            prettyPrint();
        });


        if (id != "0") {
            $.post("@Url.Action("GetOneData")", { id: id }, function (data) {
                var obj = JSON.parse(data);
                if (obj.length > 0) {
                    editor.html(obj[0].Des);
                    $("#name").val(obj[0].Name);
                    $("#sort a").each(function () {
                        if ($(this).attr("sortid") == obj[0].Sort) {
                            $(this).css("border", "1px solid red");
                            $("#sort").val(obj[0].Sort);
                        }
                    });
                    if (obj[0].IsShow == 0) {
                        $("#isshow").attr("checked", "true");
                    } else {
                        $("#isshow").removeAttr("checked");
                    }
                    if (obj[0].Xj == 1) {
                        $("#isxj").attr("checked", "true");
                    } else {
                        $("#isxj").removeAttr("checked");
                    }
                    if (obj[0].RxGood != null) {
                        $("#rx_good").attr("checked", "true");
                    } else {
                        $("#rx_good").removeAttr("checked");
                    }
                   
                    $("#imglist img:eq(0)").attr("src", obj[0].Img1);
                    $("#imglist img:eq(1)").attr("src", obj[0].Img2);
                    $("#imglist img:eq(2)").attr("src", obj[0].Img3);
                    $("#imglist img:eq(3)").attr("src", obj[0].Img4);
                    $("#imglist img:eq(4)").attr("src", obj[0].Img5);
                    $("#price").val(obj[0].Price);
                    $("#dprice").val(obj[0].DiscountPrice);
                    $("#count").val(obj[0].Count);
                    $("#paycount").val(obj[0].PayCount);
                   
                    $("#freight").val(obj[0].Freight);
                }

            });
        }
        $("#sort a").click(function () {
            $("#sort a").css("border", "1px solid #666666");
            $(this).css("border", "1px solid red");
            $("#sort").val($(this).attr("sortid"));
        });

        ///修改属性
        function aeidt(id) {
            $("#attid").val(id);
            var attid = $("#" + id).find("input").val(); //id
            var attName = $("#" + id).find("td:eq(0)").html(); //属性名称
            var attVal = $("#" + id).find("td:eq(1)").html(); //值
            var attPrice = $("#" + id).find("td:eq(2)").html(); //价格
            $("#csname").val(attName);
            $("#csprice").val(attPrice);
            $("#csval").val(attVal);
        }

        ///删除属性
        $(".adel").click(function () {
            if (confirm("确定删除该属性吗？")) {
                var id = $(".adel").index(this) + 1;
                $("#att tr:eq(" + id + ")").remove();
            }
        });
        //保存属性
        $("#saveatt").click(function () {
            var csname = $("#csname").val();
            if (csname.replace(/\s/g, "").length == 0) {
                alert("请输入属性名称！");
                return false;
            }
            if (csname.length > 10) {
                alert("属性名称输入过长！");
                return false;
            }
            var csprice = $("#csprice").val();
            var reg = /^(\d|[1-9]\d+)(\.\d+)?$/;
            if (!reg.test(csprice)) {
                alert("价格输入有误！");
                return false;
            }
            var csval = $("#csval").val();
            var timestamp = parseInt(100 * Math.random());
            var attr = $("#attid").val();
            if (attr.replace(/\s/g, "").length == 0) {
                alert("请输入属性值！");
                return false;
            }
            if (attr.length > 10) {
                alert("属性值输入过长！");
                return false;
            }
            if (attr != 0) {
                $("#" + attr).find("td:eq(0)").html(csname); //属性名称
                $("#" + attr).find("td:eq(1)").html(csval); //值
                $("#" + attr).find("td:eq(2)").html(csprice); //价格
            } else {
                var str = "<tr id=" + timestamp + "><td>" + csname + "</td><td>" + csval + "</td><td>" + csprice + "</td><td>" +
                "<input type=\"hidden\" value=\"0\" />" +
                "<button class=\"aeidt\" onclick='aeidt(" + timestamp + ")'>修改</button>&nbsp;&nbsp;<button class=\"adel\" onclick='adel(" + timestamp + ")'>删除</button></td></tr>";
                $("#att").append(str);
            }
            $("#csname").val("");
            $("#csprice").val("");
            $("#csval").val("");
            $("#attid").val("0");

        });

        function adel(id) {
            if (confirm("确定删除该属性吗？")) {
                $("#" + id).remove();
            }
        }

        function edit() {
            var acount = $("#att tr").size();
            var attlist = "";
            if (acount > 1) {
                for (var i = 1; i < acount; i++) {
                    attlist += $("#att tr:eq(" + i + ")").find("input").val() + "^"; //id
                    attlist += $("#att tr:eq(" + i + ")").find("td:eq(0)").html() + "^";
                    attlist += $("#att tr:eq(" + i + ")").find("td:eq(1)").html() + "^";
                    attlist += $("#att tr:eq(" + i + ")").find("td:eq(2)").html() + "◎";
                }
                attlist = attlist.substring(0, attlist.length - 1);
            }
            var imgs = ""; //商品图片
            var pl = "";
            $("#imglist img").each(function (i) {
                if ($(this).attr("src") != "") {
                    imgs += $(this).attr("src") + ",";
                    pl += $("#imglist input:eq(" + (i - 0) + ")").val() + ",";
                }
            });
            if (imgs == "") {
                alert("请上传商品图片！");
                return false;
            } else {
                imgs = imgs.substring(0, imgs.length - 1);
                pl = pl.substring(0, pl.length - 1);
            }

            var name = $("#name").val(); //商品名称
            if (name.replace(/\s/g, "").length == 0) {
                alert("请输入商品名称！");
                return false;
            }
            var price = $("#price").val(); //原价
            var reg = /^(\d|[1-9]\d+)(\.\d+)?$/;
            if (!reg.test(price)) {
                alert("价格输入有误！");
                return false;
            }
            var dprice = $("#dprice").val(); //折扣价格
            if (!reg.test(dprice)) {
                alert("折扣价格输入有误！");
                return false;
            }
            var reg1 = /^[0-9]*[1-9][0-9]*$/;
            var count = $("#count").val(); //数量
            if (!reg1.test(count)) {
                alert("数量输入有误！");
                return false;
            }
            var paycount = $("#paycount").val(); //销售基数
            if (!reg1.test(paycount)) {
                alert("销售基数输入有误！");
                return false;
            }
           
            var freight = $("#freight").val(); //运费
            if (freight != 0) {
                if (!reg1.test(freight)) {
                    alert("运费输入有误！");
                    return false;
                }
            }

            var text = editor.html(); //描述
            if (text.replace(/\s/g, "").length == 0) {
                alert("请输入商品描述！");
                return false;
            }
            var show = 1; //是否显示
            if ($("#isshow").attr("checked")) {
                show = 0;
            }
           
            var rx_good = 0; //
            if ($("#rx_good").attr("checked")) {
                rx_good = 1;
            }
            var xj = 0; //是否下架
            if ($("#isxj").attr("checked")) {
                xj = 1;
            }
            if ($("#sort").val() == 0) { //商品分类
                alert("请选择商品分类");
                return false;
            }
        
            $.post("@Url.Action("Edit")", {
                id: id, price: price, dprice: dprice, count: count,
                paycount: paycount, name: name, des: encodeURIComponent(text),
                imgs: imgs, show: show, sort: $("#sort").val(), pl: pl, attlist: attlist,
                freight: freight, xj: xj, rx_good: rx_good
            }, function (row) {
                if (row > 0) {
                    alert("操作成功！");
                } else {

                    alert("操作失败！");
                }

                location.href = "@Url.Action("Index")";
            });
        }

        function del(id) {
            $("#imglist img").each(function (i) {
                if ((id - 1) == i) {
                    $(this).attr("src", "");
                }
            });
        }

        function checkfile() {
            $('#fileToUpload').click();
        }
        function upload() {
            var val = $("#fileToUpload").val();
            if (val == "") {
                alert("请上传文件");
                return false;
            }
            var suffix = val.split('.');
            var arr = new Array("png", "jpg", "gif");
            if (arr.indexOf(suffix[suffix.length - 1]) < 0) {
                alert("上传格式有误！");
            } else {
                $.ajaxFileUpload({
                    url: '@Url.Action("UploadImg")',
                    secureuri: false,
                    fileElementId: 'fileToUpload',
                    dataType: 'json',
                    success: function (data, status) {
                        if (data.status == 1) {
                            $("#imglist img").each(function () {
                                if ($(this).attr("src").length<10) {
                                    $(this).attr("src", data.path);
                                    return false;
                                }
                            });
                        } else {

                        }

                    }
                });
            }
        }

    </script>

